<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>网上PC销售商城</title>
		<link rel="stylesheet" href="./css/themes/default/jquery.mobile-1.4.5.min.css">
		<link rel="stylesheet" href="./_assets/css/jqm-demos.css">
		<link rel="shortcut icon" href="./favicon.ico">
		<link rel="stylesheet" href="css/mui.min.css">
		<script src="./js/jquery.js"></script>
		<script src="./_assets/js/index.js"></script>
		<script src="./js/jquery.mobile-1.4.5.min.js"></script>
		<script src="js/mui.min.js"></script>
		<script src="js/login.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/database.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			//连接数据库
			var db = openDatabase('mydb', '1.0', 'WJN_DB', 2 * 1024 * 1024);

			function reg() {
				var name = $('#name').val();
				var password = $('#password').val();
				var realname = $('#realname').val();
				var addr = $('#addr').val();
				var phone = $('#phone').val();
				var confirmpw = $('#confirmpw').val();

				if(name == '' || password == '' || realname == '' || addr == '' || phone == '' || confirmpw == '') {
					alert("请输入完整的注册信息！");
					return;
				}
				db.transaction(function(tx) { //查看用户名是否存在
					tx.executeSql("SELECT * FROM t_user where role = 1 and name='" + name + "'", [], function(tx, results) {
						if(results.rows.length > 0) {
							alert("用户名已存在！");
							$('#name').focus();
						} else {
							if(password.length < 6) {
								alert("密码长度必须是6位以上！");
								$('#password').focus();
								return;
							}
							if(password != confirmpw) {
								alert("前后输入的密码不一致！");
								$('#password').focus();
								return;
							}
							tx.executeSql("SELECT * FROM t_user", [], function(tx, results) {
								var id = results.rows.length;
								id = id + 1;
								tx.executeSql('INSERT INTO t_user (id,name,password,role,img,addr,phone,realname) VALUES ('+id+',"'+name+'","'+password+'",1,"img/user.jpg","'+addr+'","'+phone+'","'+realname+'")');
								alert("注册成功");
								window.location.href = 'login.html';
							}, null);
						}
					}, null);
				});
			}
		</script>
	</head>

	<body>
		<!-- Start of first page: #one -->
		<div data-role="page" id="pageOne">
			<div data-role="header">
				<h1>网上PC销售商城</h1>
			</div>
			<!-- /header -->
			<div id="main" role="main" class="ui-content">
				<img src="img/regbanner.jpg" width="100%" />
				<div data-demo-html="true">
					<form method="" action="">

						<div class="ui-field-contain">
							<label for="name">用户名:</label>
							<input type="text" data-role="none" name="name" id="name" required="required">

							<label for="password">密码:</label>
							<input type="password" data-role="none" name="password" id="password" required="required">

							<label for="confirmpw">确认密码:</label>
							<input type="password" data-role="none" name="confirmpw" id="confirmpw" required="required">

							<label for="realname">真实姓名:</label>
							<input type="text" data-role="none" name="realname" id="realname" required="required">

							<label for="addr">收货地址:</label>
							<input type="text" data-role="none" name="addr" id="addr" required="required">

							<label for="phone">联系方式:</label>
							<input type="number" data-role="none" name="phone" id="phone" required="required">

							<button data-icon="info" data-role="button" type="button" onclick="javascript:reg();">注册</button>
						</div>

					</form>

				</div>
			</div>

			<div data-role="footer" data-position="fixed" data-tap-toggle="false">
				<h3>Copyright by 528魏迦南</h3>
			</div>
		</div>
	</body>

</html>